<!DOCTYPE html>

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
    
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>

<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<link rel="shortcut icon" href="../../assets/ico/favicon.ico">
<title>Admin Login Page</title>

<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
	<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
	<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<!-- <link href="http://cdn.bootcss.com/iCheck/1.0.1/skins/square/blue.css" rel="stylesheet"> -->
<link href="http://cdn.bootcss.com/iCheck/1.0.1/skins/minimal/blue.css" rel="stylesheet">
<style type="text/css">
body {
	padding-top: 40px;
	padding-bottom: 40px;
	background-color: #eee;
}

.form-signin {
	max-width: 330px;
	padding: 15px;
	margin: 0 auto;
}

.form-signin .form-signin-heading,.form-signin .checkbox {
	margin-bottom: 10px;
}

.form-signin .checkbox {
	font-weight: normal;
}

.form-signin .form-control {
	position: relative;
	height: auto;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 10px;
	font-size: 16px;
}

.form-signin .form-control:focus {
	z-index: 2;
}

.form-signin .input-group-addon.bottom,
.form-signin input[type="email"] {
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
}
.form-signin .input-group-addon.top,
.form-signin input[type="password"] {
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}

.form-signin .text-danger {
	padding: 5px 5px 5px 50px;
}
</style>
</head>

<body ng-app="adminSignInApp" ng-controller="SignInCntl">
	<div class="container" >
		<form class="form-signin" data-role="form" name="signInForm" ng-submit="submitForm()" novalidate>
			<h2 class="form-signin-heading">Please sign in</h2>
			<div class="input-group">
			  	<span class="input-group-addon bottom"><span class="glyphicon glyphicon-envelope"></span></span>
			  	<input type="email" class="form-control" placeholder="Email address" ng-model="admin.email" autofocus required>
			</div>
			<div class="input-group">
			  	<span class="input-group-addon top"><span class="glyphicon glyphicon-lock"></span></span>
			  	<input type="password" class="form-control" placeholder="Password" ng-model="admin.password" required ng-minlength="6" ng-maxlength="12">
			</div>
			<p class="text-danger" ng-show="signInForm.invalid">Authentication failed!</p>
			<label class="checkbox">
				<input type="checkbox" value="remember-me" ng-model="admin.rememberMe">&nbsp;&nbsp;Remember me
			</label>
			<button class="btn btn-lg btn-primary btn-block" type="submit" ng-disabled="signInForm.$invalid">Sign in</button>
		</form>

	</div>
	<!-- /container -->


	<!-- Bootstrap core JavaScript
    ================================================== -->
	<!-- Placed at the end of the document so the pages load faster -->
	<!-- Latest compiled and minified JavaScript -->
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
	<script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
	<script src="http://cdn.bootcss.com/iCheck/1.0.1/icheck.js"></script>
	<!-- <script src="/resources/js/iCheck-2.x-beta/icheck.js"></script> -->
	<!-- <script src="/resources/js/iCheck-master/icheck.min.js"></script> -->
	<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.12/angular.min.js"></script>
	<script type="text/javascript">
	$(document).ready(function(){
		 $('input').iCheck({
			  checkboxClass: 'icheckbox_minimal-blue',
			    radioClass: 'iradio_minimal-blue',
		    increaseArea: '20%' // optional
		  });
		});
		// create angular app
		var adminSignInApp = angular.module('adminSignInApp', []);

		// create angular controller
		adminSignInApp.controller('SignInCntl', function($scope) {
			
			// function to submit the form after all validation has occurred			
			$scope.submitForm = function() {
				// check to make sure the form is completely valid
				if ($scope.signInForm.$valid) {
					$scope.signInForm.invalid = false;
					console.log($scope.signInForm);
					console.log($scope.admin);
					$scope.signInForm.invalid = true;
					//alert('our form is amazing');
				} else {
					$scope.signInForm.invalid = true;
					console.log("in");
				}

			};

		});
	</script>
</body>
</html>
